<page-header [action]="phActionTpl">
  <ng-template #phActionTpl>
    <!-- 新建 -->
    <button (click)="add()" nz-button nzType="primary">{{ 'new' | translate }}</button>
    <button (click)="add2()" nz-button nzType="primary">测试</button>
  </ng-template>
</page-header>
<nz-card>
  <!-- 查询条件 -->
  <form nz-form>
    <div nz-row [nzGutter]="24">
      <div nz-col [nzSpan]="8">
        <nz-form-item>
          <!-- 合同编码 -->
          <nz-form-label [nzSm]="6" [nzXs]="24">
            {{ 'project.file.upload.contract' | translate }}{{ 'contract.code' | translate }}
          </nz-form-label>
          <nz-form-control [nzSm]="14" [nzXs]="24">
            <input nz-input name="code" [(ngModel)]="contractFile.code" />
          </nz-form-control>
        </nz-form-item>
      </div>
      <div nz-col [nzSpan]="8">
        <nz-form-item>
          <nz-form-label [nzSm]="2" [nzXs]="24" [nzNoColon]="true"></nz-form-label>
          <nz-form-control [nzSm]="14" [nzXs]="24">
            <button nzType="primary" (click)="query()" nz-button>
              <!-- 查询 -->
              <span>{{ 'button.query' | translate }}</span>
            </button>
          </nz-form-control>
        </nz-form-item>
      </div>
    </div>
  </form>
  <!-- 表格 -->
  <div nz-row [nzGutter]="24">
    <div nz-col [nzSpan]="24">
      <nz-table
        nzSize="small"
        #basicTable
        [nzData]="listOfData"
        [nzFrontPagination]="false"
        [nzTotal]="page.total"
        [nzPageIndex]="page.current"
        (nzPageIndexChange)="pageIndexChange($event)"
        [nzLoading]="isSpinning"
      >
        <thead>
          <tr>
            <!-- 合同编码 -->
            <th>{{ 'project.file.upload.contract' | translate }}{{ 'contract.code' | translate }}</th>
            <!-- 项目名称 -->
            <th>{{ 'cost.item.name' | translate }}</th>
            <!-- 合同日期 -->
            <th>{{ 'project.file.upload.contract' | translate }}{{ 'Date' | translate }}</th>
            <!-- 里程碑类型 -->
            <th>{{ 'milestone.milestone.type' | translate }}</th>
            <!-- 客户 -->
            <th>{{ 'customer' | translate }}</th>
            <!-- 标准报价 -->
            <th>{{ 'standard.quotation' | translate }}</th>
            <!-- 成交金额 -->
            <th>{{ 'deal.price' | translate }}</th>
            <!-- 操作 -->
            <th>{{ 'table.operation' | translate }}</th>
          </tr>
        </thead>
        <tbody>
          <tr *ngFor="let data of basicTable.data">
            <td>{{ data.code }}</td>
            <td>{{ data.proName }}</td>
            <td>{{ data.contractDate }}</td>
            <td>{{ data.milestoneName }}</td>
            <td>{{ data.fdCustomerName }}</td>
            <td>{{ data.standardQuotation }}</td>
            <td>{{ data.transactionAmount }}</td>
            <td>
              <!-- 详情 -->
              <a (click)="view(data.id)">{{ 'table.view' | translate }}</a>
              <nz-divider nzType="vertical"></nz-divider>
              <!-- 修改 -->
              <a (click)="update(data.id)">{{ 'table.update' | translate }}</a>
              <nz-divider nzType="vertical"></nz-divider>
              <!-- 删除 -->
              <!-- <a (click)="delete(data.id)">{{ 'table.delete' | translate }}</a> -->

              <a
                nz-popconfirm
                nzTitle="{{ 'confirm.to.delete' | translate }}?"
                nzOkText="{{ 'yes' | translate }}"
                nzCancelText="{{ 'no' | translate }}"
                (nzOnConfirm)="delete(data.id)"
                >{{ 'table.delete' | translate }}</a
              >
              <!-- 更多 -->
              <nz-divider nzType="vertical"></nz-divider>
              <nz-dropdown>
                <a nz-dropdown> {{ 'menu.more' | translate }} <i nz-icon type="down"></i> </a>
                <ul nz-menu nzSelectable>
                  <!-- 修改 -->
                  <li nz-menu-item>
                    <!-- 提交流程 -->
                    <a href="javascript:;" (click)="submitProcess(data.id)">{{ 'submit.process' | translate }}</a>
                  </li>
                </ul>
              </nz-dropdown>
            </td>
          </tr>
        </tbody>
      </nz-table>
    </div>
  </div>
</nz-card>
